<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>编辑商品表</title>
	<link rel="stylesheet" type="text/css" href="${params.contextPath}/common/layui/cascader/cascader.css"/>
	<#include "/common/vue_resource.ftl">
	<#include "/common/upload.ftl">
	<link rel="stylesheet" type="text/css" href="${params.contextPath}/common/steps/steps.min.css"/>
	<script type="text/javascript" src="${params.contextPath}/common/steps/steps.min.js"></script>
	<link href="${params.contextPath!}/common/umeditor/themes/default/css/umeditor.css" type="text/css" rel="stylesheet">
	<script type="text/javascript" charset="utf-8" src="${params.contextPath!}/common/umeditor/umeditor.config.js"></script>
	<script type="text/javascript" charset="utf-8" src="${params.contextPath!}/common/umeditor/umeditor.min.js"></script>
	<script type="text/javascript" src="${params.contextPath!}/common/umeditor/lang/zh-cn/zh-cn.js"></script>

	<script type="text/javascript" src="${params.contextPath}/common/layui/cascader/cascader.js"></script>
	<style>
		.promotion-table th{text-align:center;font-weight:bold;}
		.webuploader-container .webuploader-pick{width:130px;height:148px;text-align:center;line-height:148px;font-size:42px;border:1px dotted;border-radius:5px;}
		.image-item{width:148px;height:148px;display:inline-block;overflow:hidden;vertical-align:top;margin-right:10px;border-radius:5px;position:relative;border:1px solid #ccc;}
		.image-item img{height:100%;}
		.image-item .ope{position:absolute;top:0px;right:0px;left:0px;bottom:0px;background:rgba(0,0,0,0.4);color:#fff;text-align:center;line-height:148px;font-size:18px;cursor:pointer;z-index:10;}
		.image-item .ope .fa:first-child{margin-right:10px;}
	</style>
</head>
<body>
<div id="app" v-cloak>
	<div class="ui-form">
		<div id="steps"></div>
		<form class="layui-form" @submit.prevent="submitForm()" method="post">
			<#--商品信息-->
			<div v-show="stepNum == 0">
				<div class="layui-form-item">
					<label class="layui-form-label">商品分类<span class="ui-request">*</span></label>
					<div class="layui-input-block">
						<#--<select v-model="record.productCategoryId" class="layui-input">
							<option value="">请选择</option>
						</select>-->
						<input id="productCategory" type="text" v-model="record.productCategoryLabel" class="layui-input" readonly style="cursor:pointer;"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">商品名称<span class="ui-request">*</span></label>
					<div class="layui-input-block">
						<input type="text" v-model="record.name" placeholder="请输入名称" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">副标题<span class="ui-request">*</span></label>
					<div class="layui-input-block">
						<input type="text" v-model="record.subTitle" placeholder="请输入副标题" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">商品品牌<span class="ui-request">*</span></label>
					<div class="layui-input-block">
						<select v-model="record.brandId" class="layui-input">
							<option value="">请选择</option>
							<option :value="item.id" v-for="(item, index) in brandList" :key="item.id">{{item.name}}</option>
						</select>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">商品货号</label>
					<div class="layui-input-block">
						<input type="text" v-model="record.productSn" placeholder="请输入货号" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">商品售价</label>
					<div class="layui-input-block">
						<input type="text" v-model="record.price" placeholder="请输入售价" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">市场价</label>
					<div class="layui-input-block">
						<input type="text" v-model="record.originalPrice" placeholder="请输入市场价" class="layui-input"/>
					</div>
				</div>
				<#--<div class="layui-form-item">
					<label class="layui-form-label">商品库存</label>
					<div class="layui-input-block">
						<input type="text" v-model="record.stock" placeholder="请输入库存" class="layui-input"/>
					</div>
				</div>-->
				<#--<div class="layui-form-item">
					<label class="layui-form-label">库存预警值</label>
					<div class="layui-input-block">
						<input type="text" v-model="record.lowStock" placeholder="请输入库存预警值" class="layui-input"/>
					</div>
				</div>-->
				<div class="layui-form-item">
					<label class="layui-form-label">计量单位</label>
					<div class="layui-input-block">
						<input type="text" v-model="record.unit" placeholder="请输入单位" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">商品重量(克)</label>
					<div class="layui-input-block">
						<input type="text" v-model="record.weight" placeholder="请输入商品重量" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">排序</label>
					<div class="layui-input-block">
						<input type="text" v-model="record.sort" placeholder="请输入排序" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">运费模版</label>
					<div class="layui-input-block">
						<select v-model="record.feightTemplateId" class="layui-input">
							<option value="">请选择</option>
						</select>
					</div>
				</div>
			</div>

			<#--促销信息-->
			<div v-show="stepNum == 1">
				<div class="layui-form-item">
					<label class="layui-form-label">赠送积分</label>
					<div class="layui-input-block">
						<input type="text" v-model="record.giftPoint" placeholder="请输入赠送的积分" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">赠送成长值</label>
					<div class="layui-input-block">
						<input type="text" v-model="record.giftGrowth" placeholder="请输入赠送的成长值" class="layui-input"/>
					</div>
				</div>
				<#--<div class="layui-form-item">
					<label class="layui-form-label">积分购买限制<span class="ui-request">*</span></label>
					<div class="layui-input-block">
						<input type="text" v-model="record.usePointLimit" placeholder="请输入限制使用的积分数" class="layui-input"/>
					</div>
				</div>-->
				<div class="layui-form-item">
					<label class="layui-form-label">预告商品</label>
					<div class="layui-input-block" style="padding-top:10px;min-height: 26px;">
						<label class="ui-form-label"><input type="radio" v-model="record.previewStatus" value="1"/> 是</label>
						<label class="ui-form-label"><input type="radio" v-model="record.previewStatus" value="2"/> 否</label>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">商品上架</label>
					<div class="layui-input-block" style="padding-top:10px;min-height: 26px;">
						<label class="ui-form-label"><input type="radio" v-model="record.publishStatus" value="1"/> 上架</label>
						<label class="ui-form-label"><input type="radio" v-model="record.publishStatus" value="2"/> 下架</label>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">新品状态</label>
					<div class="layui-input-block" style="padding-top:10px;min-height: 26px;">
						<label class="ui-form-label"><input type="radio" v-model="record.newStatus" value="1"/> 新品</label>
						<label class="ui-form-label"><input type="radio" v-model="record.newStatus" value="2"/> 不是新品</label>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">推荐状态</label>
					<div class="layui-input-block" style="padding-top:10px;min-height: 26px;">
						<label class="ui-form-label"><input type="radio" v-model="record.recommandStatus" value="1"/> 推荐</label>
						<label class="ui-form-label"><input type="radio" v-model="record.recommandStatus" value="2"/> 不推荐</label>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">服务保证</label>
					<div class="layui-input-block" style="padding-top:10px;min-height: 26px;">
						<label class="ui-form-label"><input type="checkbox" v-model="record.serviceIds" value="1"/> 无忧退货</label>
						<label class="ui-form-label"><input type="checkbox" v-model="record.serviceIds" value="2"/> 快速退款</label>
						<label class="ui-form-label"><input type="checkbox" v-model="record.serviceIds" value="3"/> 免费包邮</label>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">备注</label>
					<div class="layui-input-block">
						<textarea v-model="record.note" placeholder="请输入备注" class="layui-textarea"></textarea>
					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">优惠方式</label>
					<div class="layui-input-block" style="padding-top:10px;min-height: 26px;">
						<label class="ui-form-label"><input type="radio" v-model="record.promotionType" value="0"/> 无优惠</label>
						<label class="ui-form-label"><input type="radio" v-model="record.promotionType" value="1"/> 特惠促销</label>
						<#--<label class="ui-form-label"><input type="radio" v-model="record.promotionType" value="2"/> 会员价格</label>-->
						<label class="ui-form-label"><input type="radio" v-model="record.promotionType" value="3"/> 阶梯价格</label>
						<label class="ui-form-label"><input type="radio" v-model="record.promotionType" value="4"/> 满减价格</label>
					</div>
					<div class="layui-input-block" v-show="record.promotionType != 0" style="background:#F5F7FA;padding:20px 0px;">
						<#--特惠促销-->
						<div v-show="record.promotionType == 1" style="padding-right:20px;">
							<div class="layui-form-item">
								<label class="layui-form-label">开始时间</label>
								<div class="layui-input-block">
									<input type="text" id="promotionStartTime" v-model="record.promotionStartTime" placeholder="请输入促销开始时间" class="layui-input" readonly/>
								</div>
							</div>
							<div class="layui-form-item">
								<label class="layui-form-label">结束时间</label>
								<div class="layui-input-block">
									<input type="text" id="promotionEndTime" v-model="record.promotionEndTime" placeholder="请输入促销结束时间" class="layui-input" readonly/>
								</div>
							</div>
							<div class="layui-form-item">
								<label class="layui-form-label">促销价格</label>
								<div class="layui-input-block">
									<input type="text" v-model="record.promotionPrice" placeholder="请输入促销价格" class="layui-input"/>
								</div>
							</div>
						</div>
						<#--阶梯价格-->
						<div v-show="record.promotionType == 3" style="padding:0px 20px;">
							<table class="layui-table promotion-table" lay-size="sm">
								<thead>
								<tr>
									<th>数量</th>
									<th>折扣(例如：“95”表示95折)</th>
									<th>操作</th>
								</tr>
								</thead>
								<tbody>
								<tr v-for="(item, index) in ladderList" :key="'ladder_' + index">
									<td><input type="text" v-model="item.count" class="layui-input"></td>
									<td><input type="text" v-model="item.discount" class="layui-input"></td>
									<td>
										<input type="button" class="layui-btn layui-btn-xs layui-btn-danger" @click="removeLadder(index)" value="删除"/>
										<input type="button" class="layui-btn layui-btn-xs layui-btn-normal" @click="addLadder" value="添加"/>
									</td>
								</tr>
								</tbody>
							</table>
						</div>
						<#--满减价格-->
						<div v-show="record.promotionType == 4" style="padding:0px 20px;">
							<table class="layui-table promotion-table" lay-size="sm">
								<thead>
								<tr>
									<th>满</th>
									<th>立减</th>
									<th>操作</th>
								</tr>
								</thead>
								<tbody>
								<tr v-for="(item, index) in fullReductionList" :key="'fullReduction_' + index">
									<td><input type="text" v-model="item.fullPrice" class="layui-input"></td>
									<td><input type="text" v-model="item.reducePrice" class="layui-input"></td>
									<td>
										<input type="button" class="layui-btn layui-btn-xs layui-btn-danger" @click="removeFullReduction(index)" value="删除"/>
										<input type="button" class="layui-btn layui-btn-xs layui-btn-normal" @click="addFullReduction" value="添加"/>
									</td>
								</tr>
								</tbody>
							</table>
						</div>

					</div>
				</div>
			</div>

			<#--属性信息-->
			<div v-show="stepNum == 2">
				<div class="layui-form-item">
					<label class="layui-form-label">属性类型</label>
					<div class="layui-input-block">
						<select v-model="record.productAttributeCategoryId" class="layui-input" @change="attributeCategoryChange">
							<option value="">请选择</option>
							<option :value="item.id" v-for="(item, index) in attributeCategoryList" :key="item.id">{{item.name}}</option>
						</select>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">商品规格<span class="ui-request">*</span></label>
					<div class="layui-input-block" style="background:#F5F7FA;padding:20px 0px;">
						<div class="layui-form-item" v-for="(item, index) in attributeStandardList" :key="item.id">
							<label class="layui-form-label">{{item.name}}：</label>
							<div class="layui-input-block" style="padding-top:10px;min-height: 26px;">
								<label class="ui-form-label" v-for="(value, index) in item.inputListArr" :key="'inputListArr_' + index">
									<input type="radio" v-model="item.value" v-if="item.selectType == 1" :value="value"/>
									<input type="checkbox" v-model="item.value" v-if="item.selectType == 2" :value="value"/>
									{{value}}
								</label>
							</div>
							<div class="layui-input-block" v-if="item.handAddStatus == 1">
								<input type="text" class="layui-input" v-model="item.handValue" style="width:200px;display:inline-block;"/>
								<input type="button" class="layui-btn layui-btn-normal" @click="addAttrValue(item.id, index)" value="添加"/>
							</div>
						</div>
						<#--end-->
					</div>
					<div class="layui-input-block" style="background:#F5F7FA;padding:20px;margin-top:20px;">
						<table class="layui-table">
							<thead>
							<tr>
								<th>{{skuStandardTitle}}</th>
								<th>销售价格<span class="ui-request">*</span></th>
								<th>商品库存</th>
								<th>库存预警值</th>
								<th>SKU编号</th>
								<th>操作</th>
							</tr>
							</thead>
							<tbody>
							<tr v-for="(item, index) in skuStockList" :key="'skuStockList_' + index">
								<td>{{item.sp2}}</td>
								<td><input type="text" v-model="item.price" class="layui-input"></td>
								<td><input type="text" v-model="item.stock" class="layui-input"></td>
								<td><input type="text" v-model="item.lowStock" class="layui-input"></td>
								<td><input type="text" v-model="item.skuCode" class="layui-input"></td>
								<td>
									<input type="button" class="layui-btn layui-btn-xs layui-btn-danger" @click="removeStock(index)" value="删除"/>
								</td>
							</tr>
							</tbody>
						</table>
						<input type="button" class="layui-btn" @click="refreshStock()" value="刷新列表"/>
						<input type="button" class="layui-btn" @click="stockComplete()" value="补全列表"/>
						<input type="button" class="layui-btn" @click="syncStockPrice()" value="同步价格"/>
						<div class="layui-form-mid layui-word-aux">
							"刷新列表"将会根据勾选的商品规格重新生成SKU信息<br/>
							"补全列表"会把未生成的SKU信息补全<br/>
							"同步价格"会把第一步商品信息中的商品售价同步到SKU的销售价格
						</div>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">商品参数</label>
					<div class="layui-input-block" style="background:#F5F7FA;padding:20px 0px;">
						<div class="layui-form-item" v-for="(item, index) in attributeParamsList" :key="item.id">
							<label class="layui-form-label">{{item.name}}：</label>
							<#--手工输入-->
							<div v-if="item.selectType == 0" class="layui-input-block">
								<input type="text" v-model="item.value" class="layui-input"/>
							</div>
							<#--单选-->
							<div v-if="item.selectType == 1" class="layui-input-block">
								<select v-model="item.value" class="layui-input">
									<option value="">请选择</option>
									<option :value="value" v-for="(value, index) in item.inputListArr" :key="'inputListArr2_' + index">{{value}}</option>
								</select>
							</div>
							<#--多选-->
							<div v-if="item.selectType == 2" class="layui-input-block" style="padding-top:10px;min-height: 26px;">
								<label class="ui-form-label" v-for="(value, index) in item.inputListArr" :key="'inputListArr2_' + index">
									<input type="checkbox" v-model="item.value" :value="value"/>
									{{value}}
								</label>
							</div>
						</div>
						<#--end-->
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">商品相册<span class="ui-request">*</span></label>
					<#--<div class="layui-input-block">
						<input type="text" v-model="record.albumPics" placeholder="请输入画册图片，连产品图片限制为5张，以逗号分割" class="layui-input"/>
					</div>-->
					<div class="layui-input-block">
						<div class="image-item" @mouseover="showImageOpe(index)" @mouseleave="hideImageOpe(index)" v-for="(item, index) in imageList" :key="'image_' + index">
							<img :src="item.showPath">
							<div class="ope" v-show="item.show">
								<span class="fa fa-search-plus" @click="showImage(index)"></span>
								<span class="fa fa-trash" @click="removeImage(index)"></span>
							</div>
						</div>
						<a id="select-file-button"></a>
						<div class="layui-form-mid layui-word-aux">只能上传jpg/png文件，且不超过10MB</div>
					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">详情标题</label>
					<div class="layui-input-block">
						<input type="text" v-model="record.detailTitle" placeholder="请输入详情标题" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">详情信息</label>
					<div class="layui-input-block">
						<script type="text/plain" id="contentEditor" style="width:100%;height:240px;"></script>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">关键字</label>
					<div class="layui-input-block">
						<input type="text" v-model="record.keywords" placeholder="请输入关键字" class="layui-input"/>
					</div>
				</div>
			</div>

			<#--商品关联信息-->
			<div v-show="stepNum == 3">
				关联专题，后续开发
			</div>

			<div class="layui-form-item">
				<div class="layui-input-block">
					<input type="button" value="下一步，填写商品促销" v-if="stepNum == 0" @click="setStep(1)" class="layui-btn layui-btn-normal" />

					<input type="button" value="上一步，填写商品信息" v-if="stepNum == 1" @click="setStep(0)" class="layui-btn  layui-btn-primary" />
					<input type="button" value="下一步，填写商品属性" v-if="stepNum == 1" @click="setStep(2)" class="layui-btn layui-btn-normal" />

					<input type="button" value="上一步，填写商品促销" v-if="stepNum == 2"  @click="setStep(1)" class="layui-btn  layui-btn-primary" />
					<input type="button" value="下一步，填写商品关联" v-if="stepNum == 2"  @click="setStep(3)" class="layui-btn layui-btn-normal" />

					<input type="button" value="上一步，填写商品属性" v-if="stepNum == 3"  @click="setStep(2)" class="layui-btn  layui-btn-primary" />
					<input type="submit" value="保存商品" v-if="stepNum == 3" class="layui-btn" />
				</div>
			</div>
		</form>
	</div>
</div>
<script>
	var app = new Vue({
		el: '#app',
		data: {
			showTypes: false,
			record: {
				id: '${params.id!}',
				brandId: '',
				productCategoryId: '',
				productCategoryLabel: '',
				feightTemplateId: '',
				productAttributeCategoryId: '',
				name: '',
				productSn: '',
				publishStatus: '2',
				newStatus: '2',
				recommandStatus: '2',
				sort: '0',
				price: '0',
				promotionPrice: '0',
				originalPrice: '0',
				giftGrowth: '0',
				giftPoint: '0',
				//usePointLimit:'',
				subTitle: '',
				//stock: '0',
				//lowStock: '0',
				unit: '',
				previewStatus: '2',
				weight: '',
				serviceIds: [],
				keywords: '',
				note: '',
				albumPics: '',
				detailTitle: '',
				promotionStartTime: '',
				promotionEndTime: '',
				//promotionPerLimit:'',
				promotionType: '0',
				ladderListStr: '',
				fullReductionListStr: '',
				skuStockListStr: '',
				attributeParamsListStr: '',
				content: '',
				imageIds: '',
			},
			stepNum: 0,
			ladderList: [],
			fullReductionList: [],
			attributeCategoryList: [],
			attributeStandardList: [],
			attributeParamsList: [],
			skuStockList: [],
			skuStandardTitle: '',
			imageList: [],
			brandList: [],
			categoryList: [],
			categoryMap: {},
		},
		mounted: function () {
			this.init();
			//this.loadData();
		},
		watch: {
			record: {
				handler: function (value) {
					var promotionType = value.promotionType;
					if (window.promotionType && promotionType == window.promotionType) {
						return;
					}
					window.promotionType = promotionType;

					if (window.renderData) {
						window.renderData = false;
						return;
					}
					this.record.ladderListStr = "";
					this.record.fullReductionListStr = "";
					this.record.promotionStartTime = "";
					this.record.promotionEndTime = "";
					this.record.promotionPrice = "";
					this.ladderList = [];
					this.fullReductionList = [];

					if (promotionType == 0 || promotionType == 1) {//清空所有数据、特惠促销
						return;
					}
					if (promotionType == 3) {//阶梯价格
						this.ladderList = [{discount:'', count:''}];
						return;
					}
					if (promotionType == 4) {//满减价格
						this.fullReductionList = [{fullPrice:'', reducePrice:''}];
						return;
					}
				},
				deep: true
			},
		},
		methods: {
			init: function () {
				var that = this;
				laydate.render({
					elem: '#promotionStartTime', type: 'datetime', done: function (value) {
						that.record.beginDate = value;
					}
				});

				laydate.render({
					elem: '#promotionEndTime', type: 'datetime', done: function (value) {
						that.record.beginDate = value;
					}
				});

				this.steps = steps({
					el: "#steps",
					data: [
						{title: "填写商品信息", description: ""},
						{title: "填写商品促销", description: ""},
						{title: "填写商品属性", description: ""},
						{title: "选择商品关联", description: ""}
					],
					center: true,
					active: 0,
					dataOrder: ["line", "title", "description"]
				});

				$.upload({
					accept: {title: 'Images', extensions: 'jpg,jpeg,png', mimeTypes: 'image/!*'},
					fileSingleSizeLimit: 10 * 1024 * 1024,//10M
					uploadSuccess: function (file, data) {
						if (!data.success) {
							$.message(data.message);
							return;
						}
						var result = data.data[0];
						var showPath = "${params.fileRequestUrl!}" + result.path;
						that.imageList.push({id: result.id, path: result.path, showPath: showPath, show: false});
					}
				});

				window.um = UM.getEditor('contentEditor', {
					UMEDITOR_HOME_URL: "${params.contextPath!}/common/umeditor/",
					imageUrl: "${params.contextPath!}/web/attachment/ueupload.json",
					imagePath: "${params.fileRequestUrl!}",
				});
				//this.loadAttributeCategory();
				this.loadCategory();
			},
			setStep: function (num) {
				this.stepNum = num;
				this.steps.setActive(num);
			},
			loadCategory: function () {//获取分类列表
				var that = this;
				$.http.post('${params.contextPath}/web/pmsProductCategory/queryList.json').then(function (data) {
					if (!data.success) {
						$.message(data.message);
						return;
					}
					var list = data.data, map = {}, categoryMap = {};
					that.categoryList = list;
					for (var i = 0; i < list.length; i ++) {
						var item = list[i];
						map[item.id] = item;
						item.value = item.id;
						item.label = item.name;

						categoryMap[item.id] = item;
					}
					that.categoryMap = categoryMap;

					for (var i = 0; i < list.length; i ++) {
						var item = list[i];
						var parent = map[item.parentId];
						if (!parent) {
							continue;
						}
						var children = parent.children || [];
						children.push(item);
						parent.children = children;
						map[item.id] = null;
					}

					var resultList = [];
					for (var key in map) {
						var item = map[key];
						if (!item) {
							continue;
						}
						resultList.push(item);
					}

					var cascader = layui.cascader;
					that.cas = cascader({
						elem: "#productCategory",
						data: resultList,
						value: [],
						success: function (valData, labelData) {
							that.record.productCategoryId = valData[valData.length - 1];
							that.record.productCategoryLabel = labelData;
							//console.log(valData, labelData);
						}
					});
					that.loadBrand();
				});
			},
			loadBrand: function () {//获取品牌列表
				var that = this;
				$.http.post('${params.contextPath}/web/pmsBrand/queryList.json').then(function (data) {
					if (!data.success) {
						$.message(data.message);
						return;
					}
					that.brandList = data.data;
					that.loadAttributeCategory();
				});
			},
			loadAttributeCategory: function () {//获取属性类型列表
				var that = this;
				$.http.post('${params.contextPath}/web/pmsProductAttributeCategory/queryList.json').then(function (data) {
					if (!data.success) {
						$.message(data.message);
						return;
					}
					that.attributeCategoryList = data.data;
					that.loadData();
				});
			},
			loadAttribute: function (categoryId, renderParamsList) {//获取商品规格、商品参数
				var that = this;
				$.http.post('${params.contextPath}/web/pmsProductAttribute/queryList.json', {categoryId: categoryId}).then(function (data) {
					if (!data.success) {
						$.message(data.message);
						return;
					}
					var list = data.data, stanardTitle = [];
					that.attributeStandardList = [];
					that.attributeParamsList = [];
					for (var i = 0, size = list.length; i < size; i++) {
						var record = list[i];
						record.handValue = "";
						if (record.selectType == 0 || record.selectType == 1) {
							record.value = "";
						} else if (record.selectType == 2) {
							record.value = [];
						}
						if (record.type == 0) {
							stanardTitle.push(record.name);
							that.attributeStandardList.push(record);
						} else if (record.type == 1) {
							that.attributeParamsList.push(record);
						}
					}
					that.skuStandardTitle = stanardTitle.join(" / ") || "--";
					that.refreshSelectStandardValue();

					//回显商品参数
					if (renderParamsList) {
						var paramsMap = {};
						for (var i = 0; i < renderParamsList.length; i++) {
							var param = renderParamsList[i];
							paramsMap[param.productAttributeId] = param;
						}
						for (var i = 0; i < that.attributeParamsList.length; i++) {
							var param = that.attributeParamsList[i];
							var p = paramsMap[param.id];
							if (!p) {
								continue;
							}
							param.value = Array.isArray(param.value) ? eval('(' + p.value + ')') : p.value;
						}
					}
				});
			},
			refreshSelectStandardValue: function () {
				var map = {};
				for (var i = 0; i < this.skuStockList.length; i ++) {
					var sku = this.skuStockList[i];
					var ids = sku.sp1;
					var values = sku.sp2;
					var idArr = ids.split("/");
					for (var j = 0; j < idArr.length; j ++) {
						var id = idArr[j];
						if (map[id]) {
							continue;
						}
						map[id] = [];
					}

					var valueArr = values.split(" / ");
					for (var j = 0; j < valueArr.length; j ++) {
						var value = valueArr[j];
						if (value == "--") {
							continue;
						}
						var id = idArr[j];
						var arr = map[id];
						if (arr.indexOf(value) >= 0) {
							continue;
						}
						arr.push(value);
					}
				}

				for (var i = 0; i < this.attributeStandardList.length; i ++) {
					var standard = this.attributeStandardList[i];
					var valueArr = map[standard.id];
					if (!valueArr) {
						continue;
					}
					if (Array.isArray(standard.value)) {
						standard.value = valueArr;
						continue;
					}
					standard.value = valueArr[0];
				}
			},
			loadData: function () {
				if (!'${params.id!}') {
					return;
				}
				var that = this;
				$.http.post('${params.contextPath}/web/pmsProduct/query.json', {id: '${params.id!}'}).then(function (data) {
					if (!data.success) {
						$.message(data.message);
						return;
					}
					var item = data.data;
					for (var key in  that.record) {
						that.record[key] = item[key] || "";
					}
					window.renderData = true;

					//设置标签内容
					var category = that.categoryMap[item.productCategoryId], labelName = '';
					if (category) {
						var parent = that.categoryMap[category.parentId];
						labelName = parent ? parent.name + "," + category.name : category.name;
						that.record.productCategoryLabel = labelName;
					}

					//设置服务保证
					that.record.serviceIds = item.serviceIds ? item.serviceIds.split(",") : [];

					that.record.promotionStartTime = item.promotionStartTimeStr || "";
					that.record.promotionEndTime = item.promotionEndTimeStr || "";

					//设置优惠方式--阶梯价格
					that.ladderList = item.ladderList || [];

					//设置优惠方式--满减价格
					that.fullReductionList = item.fullReductionList || [];

					//设置sku
					that.skuStockList = item.skuStockList;
					if (item.productAttributeCategoryId) {
						that.loadAttribute(item.productAttributeCategoryId, item.productAttributeValueList);
					}

					//设置图片
					for (var i = 0; i < item.attachmentList.length; i ++) {
						var image = item.attachmentList[i];
						image.showPath = "${params.fileRequestUrl!}" + image.path;
						image.show = false;
					}
					that.imageList = item.attachmentList;

					window.um.setContent(item.content);
				});
			},
			attributeCategoryChange: function () {
				if (!this.record.productAttributeCategoryId) {
					this.attributeStandardList = [];
					this.attributeParamsList = [];
					return
				}
				this.loadAttribute(this.record.productAttributeCategoryId);
			},
			submitForm: function () {
				if (this.ladderList && this.ladderList.length > 0) {
					this.record.ladderListStr = JSON.stringify(this.ladderList);
				}
				if (this.fullReductionList && this.fullReductionList.length > 0) {
					this.record.fullReductionListStr = JSON.stringify(this.fullReductionList);
				}
				if (this.skuStockList && this.skuStockList.length > 0) {
					this.record.skuStockListStr = JSON.stringify(this.skuStockList);
				}
				this.record.content = window.um.getContent() || "";
				if (this.imageList && this.imageList.length > 0) {
					this.record.albumPics = this.imageList[0].path;
					var ids = [];
					for (var i = 0; i < this.imageList.length; i++) {
						var id = this.imageList[i].id;
						ids.push(id);
					}
					this.record.imageIds = ids.join(",");
				}
				if (this.attributeParamsList && this.attributeParamsList.length > 0) {
					var list = [];
					for (var i = 0; i < this.attributeParamsList.length; i++) {
						var item = this.attributeParamsList[i];
						if (!item.value) {
							continue;
						}
						list.push({productAttributeId: item.id, value: item.value});
					}
					this.record.attributeParamsListStr = list.length > 0 ? JSON.stringify(list) : "";
				}
				$.http.post('${params.contextPath}/web/pmsProduct/<#if (params.id)??>modify<#else>save</#if>.json', this.record).then(function (data) {
					if (!data.success) {
						$.message(data.message);
						return;
					}
					var alt = layer.alert(data.message || "操作成功", function () {
						parent.app.loadData();
						parent.layer.closeAll();
						layer.close(alt);
					});
				});
			},
			addLadder: function () {
				this.ladderList.push({discount: '', count: ''});
			},
			removeLadder: function (index) {
				if (this.ladderList.length <= 1) {
					$.message("无法删除");
					return;
				}
				this.ladderList.splice(index, 1);
			},
			removeStock: function (index) {
				this.skuStockList.splice(index, 1);
			},
			addFullReduction: function () {
				this.fullReductionList.push({fullPrice: '', reducePrice: ''});
			},
			removeFullReduction: function (index) {
				if (this.fullReductionList.length <= 1) {
					$.message("无法删除");
					return;
				}
				this.fullReductionList.splice(index, 1);
			},
			removeImage: function (index) {
				this.imageList.splice(index, 1);
			},
			addAttrValue:function(attrId, index) {
				var that = this;
				var value = this.attributeStandardList[index].handValue;
				if (!value) {
					$.message("元素值为空");
					return;
				}
				$.http.post('${params.contextPath}/web/pmsProductAttribute/addValue.json', {id:attrId, value:value}).then(function (data) {
					if (!data.success) {
						$.message(data.message);
						return;
					}
					that.attributeStandardList[index].handValue = "";
					if (!that.attributeStandardList[index].inputListArr) {
						that.attributeStandardList[index].inputListArr = [value];
					} else {
						that.attributeStandardList[index].inputListArr.push(value);
					}
				});
			},
			syncStockPrice: function () {
				var list = this.skuStockList, price = this.record.price;
				for (var i = 0; i < list.length; i ++) {
					this.skuStockList[i].price = price || 0;
				}
			},
			stockComplete: function () {
				var idArr = [], valueArr = [];
				for (var i = 0; i < this.attributeStandardList.length; i++) {
					var item = this.attributeStandardList[i];
					idArr.push(item.id);
					if (!item.value || item.value.length <= 0) {
						valueArr.push(["--"]);
						continue;
					}
					if (Array.isArray(item.value)) {
						valueArr.push(item.value);
						continue;
					}
					valueArr.push([item.value]);
				}
				var map = {};
				for (var i = 0; i < this.skuStockList.length; i++) {
					var item = this.skuStockList[i];
					map[item.sp2] = "true";
				}
				var sp1 = idArr.join("/") || "--";
				var arr = this.doExchange(valueArr);
				for (var i = 0; i < arr.length; i++) {
					var sp2 = arr[i];
					if (map[sp2]) {
						continue;
					}
					this.skuStockList.push({sp1: sp1, sp2: sp2, skuCode: '', price: '', stock: '', lowStock: ''});
				}
			},
			refreshStock: function () {
				var idArr = [], valueArr = [];
				for (var i = 0; i < this.attributeStandardList.length; i++) {
					var item = this.attributeStandardList[i];
					idArr.push(item.id);
					if (!item.value || item.value.length <= 0) {
						valueArr.push(["--"]);
						continue;
					}
					if (Array.isArray(item.value)) {
						valueArr.push(item.value);
						continue;
					}
					valueArr.push([item.value]);
				}
				var list = [], sp1 = idArr.join("/") || "--";
				var arr = this.doExchange(valueArr);
				for (var i = 0; i < arr.length; i++) {
					list.push({sp1: sp1, sp2: arr[i], skuCode: '', price: '', stock: '', lowStock: ''});
				}
				this.skuStockList = list;
			},
			doExchange: function (arr) {
				var len = arr.length;
				// 当数组大于等于2个的时候
				if (len >= 2) {
					// 第一个数组的长度
					var len1 = arr[0].length;
					// 第二个数组的长度
					var len2 = arr[1].length;
					// 2个数组产生的组合数
					var lenBoth = len1 * len2;
					//  申明一个新数组,做数据暂存
					var items = new Array(lenBoth);
					// 申明新数组的索引
					var index = 0;
					// 2层嵌套循环,将组合放到新数组中
					for (var i = 0; i < len1; i++) {
						for (var j = 0; j < len2; j++) {
							items[index] = arr[0][i] + " / " + arr[1][j];
							index++;
						}
					}
					// 将新组合的数组并到原数组中
					var newArr = new Array(len - 1);
					for (var i = 2; i < arr.length; i++) {
						newArr[i - 1] = arr[i];
					}
					newArr[0] = items;
					// 执行回调
					return this.doExchange(newArr);
				} else {
					return arr[0];
				}
			},
			showImage: function (index) {
				var url = this.imageList[index].showPath;
				layer.open({
					type: 1,
					title: false,
					closeBtn: 1,
					area: ['80%', '80%'],
					skin: 'layui-layer-nobg', //没有背景色
					shadeClose: true,
					content: '<div><img style="width:100%;" src="' + url + '"/></div>'
				});
			},
			showImageOpe: function (index) {
				this.imageList[index].show = true;
			},
			hideImageOpe: function (index) {
				this.imageList[index].show = false;
			},
		}
	});
</script>
</body>

</html>
